<template>
  <div class="tool-bars">
    <div style="position: relative;height: 24px;">
      <preview-tool :context="context" />
      <save-tool :context="context" />
      <save-as-tool :context="context" />
      <open-tool :context="context" />
      <import-tool :context="context" />

      <undoTool :context="context" />
      <redoTool :context="context" />

      <fontFamilyTool ref="childFontFamilyTool" :context="context" />
      <fontSizeTool ref="childFontSizeTool" :context="context" />

      <boldTool :context="context" />
      <italicTool :context="context" />
      <underlineTool :context="context" />

      <forecolorTool :context="context" />
      <bgcolorTool :context="context" />

      <borderTool :context="context" />

      <mergeTool :context="context" />
      <alignLeftTool ref="childAlignLeftTool" :context="context" />
      <alignTopTool ref="childAlignTopTool" :context="context" />
      <image-tool :context="context" />
      <link-tool ref="childLinkTool" :context="context" />
      <settings-tool :context="context" />
      <form-tool :context="context" />
    </div>
  </div>
</template>

<script>
import PreviewTool from './PreviewTool'
import SaveTool from './SaveTool'
import SaveAsTool from './SaveAsTool'
import OpenTool from './OpenTool'
import ImportTool from './ImportTool'
import FormTool from './FormTool'
import SettingsTool from './SettingsTool'

import UndoTool from './UndoTool'
import RedoTool from './RedoTool'

import AlignLeftTool from './AlignLeftTool'
import AlignTopTool from './AlignTopTool'

import BorderTool from './BorderTool'
import BoldTool from './BoldTool'
import ItalicTool from './ItalicTool'
import UnderlineTool from './UnderlineTool'
import BgcolorTool from './BgcolorTool'
import ForecolorTool from './ForecolorTool'
import ImageTool from './ImageTool'
import MergeTool from './MergeTool'
import FontFamilyTool from './FontFamilyTool'
import FontSizeTool from './FontSizeTool'
import LinkTool from './LinkTool'

export default {
  name: 'ToolBar',
  components: {
    PreviewTool,
    SaveTool,
    SaveAsTool,
    OpenTool,
    ImportTool,
    FormTool,
    SettingsTool,
    ImageTool,
    UndoTool,
    RedoTool,
    FontFamilyTool,
    FontSizeTool,
    BoldTool,
    ItalicTool,
    UnderlineTool,
    ForecolorTool,
    BgcolorTool,
    BorderTool,
    MergeTool,
    AlignTopTool,
    AlignLeftTool,
    LinkTool
  },
  props: {
    context: {
      type: Object,
      required: true
    }
  },
  data: function() {
    return {

    }
  },
  mounted: function() {

  },
  methods: {
    refresh(rowIndex, colIndex, row2Index, col2Index) {
      this.$refs.childFontFamilyTool.refresh(rowIndex, colIndex, row2Index, col2Index)
      this.$refs.childFontSizeTool.refresh(rowIndex, colIndex, row2Index, col2Index)
      this.$refs.childAlignLeftTool.refresh(rowIndex, colIndex, row2Index, col2Index)
      this.$refs.childAlignTopTool.refresh(rowIndex, colIndex, row2Index, col2Index)
      this.$refs.childLinkTool.refresh(rowIndex, colIndex, row2Index, col2Index)
    }
  }
}
</script>
